{{use "jquery"}}
{{use "jqutils"}}
<style type="text/css">
<!--
table.plan-table {border:0;width:100%;}
table.plan-table th {border-bottom:1px solid #D9E7FF;border-top:1px solid #D9E7FF;margin-top:15px;padding: 2px 8px;}
table.plan-table tr {height: 30px;}
table.plan-table td {padding: 2px 8px;}
table.plan-table tr:hover{background-color: #f0f0f0;}
table.plan-table tr.child {border-bottom:1px solid #D9E7FF;border-left:1px solid #D9E7FF;border-right:1px solid #D9E7FF;}
table.plan-table tr.child div{margin: 4px 0;padding: 2px;}
table.plan-table tr.child div b{color:#00f;}
table.plan-table tr div.delay {background-color:red;color:white;}

span.milestone {-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius:10px;background-color:#11ce0e;color:#fff;padding:2px 5px;font-size:9pt;}
span.plan {-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius:10px;background-color:#969ee8;color:#fff;padding:2px 5px;font-size:9pt;}
-->
</style>

<a href="#" name="plan"></a>
<div class="box box-panel">
    <h2>任务计划</h2>
    <div class="box-body">
        <div id="plan">
            <table class="plan-table" id="plan_table">
                <thead>
                <tr>
                <th width="16"> </th>
                <th width="50">类型</th>
                <th>名称</th>
                <th>测试计划</th>
                <th>计划执行时间</th>
                <th>实际执行时间</th>
                <th>状态</th>
                <th>本周执行</th>
                <th>操作</th>
                </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        {{use "jquery"}}
        {{use "facebox"}}
        {{use "jqutils", ajaxForm=True}}
        
        <script type="text/javascript">
        var img = [];
        img[0] = new Image();
        img[0].src = '/static/plan/plus.gif';
        img[1] = new Image();
        img[1].src = '/static/plan/minus.gif';
        
        var init_img = function(){
            $('img.expand').each(function(){
                var self = $(this);
                self.click(function(){
                    var tr = $(self.parents('tr')[0]);
                    var target = tr.next();
                    target.toggle('fast', function(){
                        if ($(this).is(':visible')){
                            self[0].src = img[1].src;
                            tr.css({'border-left':'1px solid #D9E7FF', 'border-top':'1px solid #D9E7FF', 'border-right':'1px solid #D9E7FF'});
                        }else{
                            tr.css({'border':'none'});
                            self[0].src = img[0].src;
                        }
                    });
                });
            });
        }
        
        var add_work = function(){
            var a = $(this);
            var url = '/tasks/plan/add_work/{{=object.id}}/' + a.attr('rel');
            $.facebox(function() {
                $.get(url, function(data) {
                    $.facebox(data);
                    $('#add_work_form').ajaxForm(post_addwork);
                });
            });
        }
        
        var post_addwork = function(r){
            if (r.success){
                show_message(r.message);
                jQuery(document).trigger('close.facebox');
                //window.location.href="{{=request.path}}#details";
                window.location.reload();
                
            } else if (!r.success){
                $('div.error-div').remove();
                show_message(r.message, 'error');
                $.each(r.data, function(key, value){
                    var f, t, e;
                    f = 'field_' + key;
                    t = $('label[for='+f+']');
                    e = $('<div class="ui-state-error error-div" style="border:0;"><span class="ui-icon ui-icon-info" style="float:left;"></span><span class="ui-state-error-text">' + value + '</span></div>');
                    t.after(e);
                });
            }
        }
        
        var edit = function(){
            var a = $(this);
            var url = '/tasks/plan/change_plan/{{=object.id}}/' + a.attr('rel');
            $.facebox(function() {
                $.get(url, function(data) {
                    if (!$.browser.msie) $.facebox(data);
                    else $.facebox(data, '', {'width':300});
                    $('#planedit_form').ajaxForm(post_edit);
                });
            });
        }
        
        var post_edit = function(r){
            if (r.success){
                show_message(r.message);
                jQuery(document).trigger('close.facebox');
                if (r.modified){
                    var tr_id = '#plan_tr_'+r.data.id;
                    var e = $(tr_id).children('td').eq(5);
                    e.html(r.data.data);
                    e.effect('highlight', 5000);
                    var e1 = $(tr_id).children('td').eq(6);
                    e1.html(r.data.status);
                    e1.effect('highlight', 5000);
                }
            } else if (!r.success){
                $('div.error-div').remove();
                show_message(r.message, 'error');
                $.each(r.data, function(key, value){
                    var f, t, e, d;
                    f = 'field_' + key;
                    t = $('label[for='+f+']');
                    e = $('<div class="ui-state-error error-div" style="border:0;"><span class="ui-icon ui-icon-info" style="float:left;"></span><span class="ui-state-error-text">' + value + '</span></div>');
                    d = t.position();
                    t.after(e);
                });
            }
        }
        
        var add_week = function(){
            var a = $(this);
            var url = '/tasks/plan/add_week/' + a.attr('rel');
            $.facebox(function() {
                $.get(url, function(data) {
                    $.facebox(data);
                    $('#add_week_form').ajaxForm(post_addweek);
                });
            });
        }
        
        var post_addweek = function(r){
            if (r.success){
                show_message(r.message);
                jQuery(document).trigger('close.facebox');
                var tr_id = '#plan_tr_'+r.data.id +'_child';
                
                $(tr_id).find('span.week_desc').html(r.data.desc).effect('highlight', 5000);
                $(tr_id).find('span.week_finish').html(r.data.finish).effect('highlight', 5000);
                $(tr_id).find('span.week_executer').html(r.data.executer).effect('highlight', 5000);
                $(tr_id).find('span.week_syncdate').html(r.data.syncdate).effect('highlight', 5000);
                
                var tr_id = '#plan_tr_'+r.data.id;
                var info = '';
                if (r.data.info)
                    info = '已填写';
                else
                    info = '未填写';
                $(tr_id).find('span.info').html(info).effect('highlight', 5000);
            } else if (!r.success){
                $('div.error-div').remove();
                show_message(r.message, 'error');
                $.each(r.data, function(key, value){
                    var f, t, e;
                    f = 'field_' + key;
                    t = $('label[for='+f+']');
                    e = $('<div class="ui-state-error error-div" style="border:0;"><span class="ui-icon ui-icon-info" style="float:left;"></span><span class="ui-state-error-text">' + value + '</span></div>');
                    t.after(e);
                });
            }
        }
        
        $(function(){
            $.facebox.settings.loadingImage = '{{=url_for_static('facebox/loading.gif')}}'
            $.facebox.settings.closeImage = '{{=url_for_static('facebox/closelabel.png')}}'
            $.ajax({
                type: "POST",
                url: "/tasks/plan/view/{{=object.id}}",
                success: function(data){
                    $('#plan_table tbody').replaceWith(data);
                    //增加对报工的处理
                    $('#plan_table a.add_work').click(add_work);
                    $('#plan_table a.edit').click(edit);
                    $('#plan_table a.week_execute').click(add_week);
                    init_img();
                }
            });
        });
        
        </script>
        
        <div class="box-bottom">
            {{if request.user.users_systems.has(object._task_sys_) or request.user.is_gm or request.user.is_superuser:}}
                <a class="btn btn-green" href="/tasks/plan/edit/{{=obj_id}}">计划修改</a>
            {{pass}}
        </div>
    </div>
</div>
